<template>
	<view>
		<view class="input">
			<u--input placeholder="请输入您的问题" border="none" v-model="problem"></u--input>
		</view>

		<view class="line"></view>
		<view class="input2">
			<u--textarea v-model="supplement" placeholder="对问题补充说明，我们会快速查收改进" border="none"></u--textarea>
		</view>
		<image :src="picture" v-if="picture" @click="uploadImg" class="add_image"></image>
		<view class="add" @click="uploadImg" v-else>+</view>

		<view class="save" @click="save">提交</view>
	</view>
</template>

<script>
	import {
		suggestionAdd
	} from '@/api.js'
	export default {
		data() {
			return {
				problem: '',
				supplement: '',
				picture: ''
			}
		},
		methods: {
			async save() {
				let res = await suggestionAdd({
					problem: this.problem,
					supplement: this.supplement,
					picture: this.picture,
				})
				if (res.code == 200) {
					uni.showToast({
						icon: "none",
						title: "您的反馈已提交"
					})
					setTimeout(() => {
						uni.navigateBack()
					}, 2000)
				}
			},
			uploadImg() {
				var that = this

				uni.chooseImage({
					count: 1,
					success: (chooseImageRes) => {
						uni.showLoading({
							title: '加载中',
							mask: true,
						})
						const tempFilePaths = chooseImageRes.tempFilePaths;
						that.cardAddVOS = []
						uni.uploadFile({
							url: 'https://xybl.appldkj.com/api/jeecg-boot/sys/common/upload',
							filePath: tempFilePaths[0],
							name: 'file',
							formData: {
								// 'user': 'test'
							},
							success: (uploadFileRes) => {
								uni.hideLoading()
								let msg = JSON.parse(uploadFileRes.data).message
								that.picture = msg
								console.log('上传的图片msg', msg);
							}
						});
					}
				});
			},
		}
	}
</script>

<style scoped lang="scss">
	.save {
		width: 660rpx;
		height: 100rpx;
		background: rgba(251, 228, 63, 0.73);
		border-radius: 67rpx 67rpx 67rpx 67rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: bold;
		font-size: 40rpx;
		color: #FFFFFF;
		text-align: center;
		line-height: 100rpx;
		position: fixed;
		left: 45rpx;
		bottom: 60rpx;
	}

	.line {
		width: 750rpx;
		height: 2rpx;
		background: #C4C4C4;
	}

	.input {
		padding: 20rpx 40rpx;
		box-sizing: border-box;
	}

	.input2 {
		padding: 20rpx 30rpx;
		box-sizing: border-box;
	}

	.add {
		width: 206rpx;
		height: 206rpx;
		line-height: 206rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		border: 2rpx solid #D9D9D9;
		text-align: center;
		margin: 10rpx 40rpx;
		font-size: 80rpx;
		color: #D9D9D9;


	}

	.add_image {
		width: 206rpx;
		height: 206rpx;
		margin-left: 24rpx;
	}
</style>